<template>
 <layout>
    <uv-sticky
      bg-color="#F5F5F5"
      offset-top="0"
      customNavHeight="0"
    >
      <uv-navbar
        :fixed="false"
        :safeAreaInsetTop="true"
        height="0"
        bgColor="transparent"
        leftIcon=""
      />
      <!-- #ifndef MP -->
   <!--  <blank size="10"></blank> -->
      <!-- #endif -->

    </uv-sticky>

	<view class="container">
			<view class="banner">
				<uv-swiper class="bg" height="330" imgMode="aspectFill" keyName="image" :list="listAds" indicatorMode="dot" indicatorStyle="bottom"></uv-swiper>
				<view class="intro">
					<view class="greet">您好，{{ isLogin ? member.nickname : '游客' }}</view>
					<view class="note">云上点餐外卖系统</view>
				</view>
			</view>
			<view class="content">
				<view  class=" p-2 content-user">
					<view class="flex justify-between align-center">
						<view v-if="isLogin" class="flex align-center">
							<image :src="member.avatar ? member.avatar : '/static/images/mine/default.png'" class="rounded-circle" style="width:50rpx;height: 50rpx;"></image>
							<view  class="content-user-text ml-1">{{ member.nickname }}</view>	
						</view>
						<view v-else class="flex align-center">
							<image src="/static/images/mine/default.png" class="rounded-circle mr-1" style="width:50rpx;height: 50rpx;"></image>
							<view>
								<view  class="content-user-text font-weight-bolder">尊敬等用户</view>
								<view  class=" size-sm">为给您提供更好的服务请授权登录</view>
							</view>
						</view>				
						<view v-if="isLogin" class="py-1 px-2 content-user-login">
							{{ member.cardId > 0 ? member.cardName : '普通会员' }}
						</view>
						<view v-else class="bg-white py-1 px-2 content-user-login" @tap="login">登录/注册</view>
					</view>
					<view class="mt-3"><uv-line></uv-line></view>
					<view class="pb-3 pt-5">
						<uv-row >
							<uv-col span="2">
								<view class="flex justify-center">
									<image src="/static/images/003.png" style="width:50rpx;height: 50rpx;"></image>
								</view>
							</uv-col>
							<uv-col span="2">
								<view class="flex flex-column font-size-sm text-color-assist">
									<view class="text-center">余额</view>
									<view class="text-center text-dark">{{ isLogin ? member.nowMoney : '--'}}</view>
								</view>
							</uv-col>
							<uv-col span="2">
								<view class="flex justify-center">
									<image src="/static/images/002.png" style="width:50rpx;height: 50rpx;"></image>
								</view>
							</uv-col>
							<uv-col span="2">
								<view class="flex flex-column font-size-sm text-color-assist">
									<view class="text-center">积分</view>
									<view class="text-center text-dark">{{ isLogin ? member.integral : '--'}}</view>
								</view>
							</uv-col>
							<uv-col span="2">
								<view class="flex justify-center">
									<image src="/static/images/001.png" style="width:50rpx;height: 50rpx;"></image>
								</view>
							</uv-col>
							<uv-col span="2">
								<view class="flex flex-column font-size-sm text-color-assist">
									<view class="text-center">券</view>
									<view class="text-center text-dark">{{ isLogin ? member.couponCount : '--'}}</view>
								</view>
							</uv-col>
						</uv-row>
					</view>
				</view>
				<view class="flex justify-between yshop-menu">
					<view class="flex flex-column align-center yshop-menu-item "  @tap="takein">
						<view><image src="/static/images/index002.png" mode="aspectFit" class="img-01"></image></view>
						<view>自取</view>
						<view class="font-small text-light-black">下单免排队</view>
					</view>
					<view class="flex flex-column align-center yshop-menu-item "  @tap="takeout">
						<view><image src="/static/images/index003.png" mode="aspectFit" class="img-01"></image></view>
						<view>外卖</view>
						<view class="font-small text-light-black">美食送到家</view>
					</view>
				</view>
				<view class="flex justify-between" style="margin-bottom: 10rpx;">
					<view class="flex flex-column align-center yshop-menu-item "  @tap="invite">
						<view><image src="/static/images/yuyue.png" mode="aspectFit" class="img-01"></image></view>
						<view>提前预约</view>
						<view class="font-small text-light-black">提前预约,到店直接就餐</view>
					</view>
					<view class="flex flex-column align-center yshop-menu-item "  @tap="goScan">
						<view><image src="/static/images/saoma.png" mode="aspectFit" class="img-01"></image></view>
						<view>扫码点餐</view>
						<view class="font-small text-light-black">微信打开扫一扫即可享用美食哦</view>
					</view>
				</view>
				<view class="info">
					<view class="integral_section" @tap="selectShop">
						<view class="top">
							<text class="title">查看门店</text>
						</view>
						<view class="bottom">
							等你发现更多线下门店
						</view>
					</view>
					<view class="qrcode_section" @tap="selectShop">
						<image src="/static/images/store.png"></image>
						<text>找一找</text>
					</view>
				</view>
				<view class="info">
					<view class="integral_section" @tap="goScore">
						<view class="top">
							<text class="title">积分商城</text>
						</view>
						<view class="bottom">
							进入积分商城兑换奈雪券及周边好礼
						</view>
					</view>
					<view class="qrcode_section" @tap="goScore">
						<image src="/static/images/jifen.png"></image>
						<text>逛一逛</text>
					</view>
				</view>
				<view class="member-news">
					<view class="header">
						<view class="title">活动抢先知</view>
					</view>
					<view class="list">
						<view class="item" v-for="(item,index) in listNews" :key="index" @tap="goNews(item.id)">
							<image :src="item.picUrl"></image>
							<view class="title">{{ item.title }}</view>
						</view>
					</view>
				</view>
				
			</view>
	</view>
 </layout>
</template>

<script setup>
import {
  ref
} from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import {
  menuAds,
  getNews
} from '@/api/market'
import {
  getWechatConfig
} from '@/api/order'

import {tenantV2} from '../../ysd/api/tenant'

import { storeToRefs } from 'pinia'
import { useMainStore } from '@/store/store'
// #ifdef H5
import * as jweixin from 'weixin-js-sdk'
// #endif
//
const main = useMainStore()
const { member,store, isLogin} = storeToRefs(main)
//const store = ref(main.store)
const listAds = ref([])
const listNews = ref([])
// const isLogin = ref(main.isLogin)

const handGetListAds = async () => {
	let shop_id = store.id ? store.id : 0;
	let getTenantByName= await tenantV2.getTenantByName({})
	console.log("商铺ID",getTenantByName)
	
	// uni.request({
	//     url: 'http://127.0.0.1:48081/app-api/ysd/tenant/get-by-name', //仅为示例，并非真实接口地址。
	//     data: {
	//         tenantId: 'uni.request'
	//     },
	//     header: {
	//         'custom-header': 'hello' //自定义请求头信息
	//     },
	//     success: (res) => {
	//         console.log("返回123",res.data);
	//     }
	// });
	
	
	
	let data = await menuAds({
		shop_id: shop_id
		
	});
	
	if (data) {
		listAds.value = data.list;
		uni.setStorage({
				key: 'isActive',
				data: data.isActive
			});
		if(data.list.length > 0){
			uni.setStorage({
					key: 'shopAd',
					data: data.list[0].image
			 });
			}
		}
}

const getNewsList = async () => {
	let data = await getNews({});
	// console.log('listNews:',data)
	if (data) {
		listNews.value = data;
	}
}

const takein = () => {
	main.SET_ORDER_TYPE('takein')
	main.DEL_DESK()
	uni.switchTab({
		url: '/pages/menu/menu'
	})
}

const takeout = () => {
	main.SET_ORDER_TYPE('takeout')
	main.DEL_DESK()
	uni.switchTab({
		url: '/pages/menu/menu'
	}) 
}

const selectShop = () => {
	uni.navigateTo({
		url: '/pages/components/pages/shop/shop'
	})
}

const goNews = (id) => {
	uni.navigateTo({
			url: '/pages/components/pages/mine/news?id=' + id
		})
}

const coupons = () => { 
	if(!main.isLogin) {
		uni.navigateTo({url: '/pages/components/pages/login/login'})
		return
	}
	uni.navigateTo({
		url: '/pages/components/pages/coupons/coupons?current=4'
	})
}

const goScore = () => { 
	uni.navigateTo({
		url: '/pages/components/pages/scoreproduct/list'
	})
}

const getNewPath = (path) => {
	const tempPath = decodeURIComponent(path);
	const strList = tempPath.split("?scene=");
	const scene = encodeURIComponent(strList[1]);
	const newPath = strList[0] +"?scene=" + scene;
	
	return newPath;
}

const goScan = async() => {
// #ifdef  MP-WEIXIN
	uni.scanCode({
		success: function (res) {
			const newPath = getNewPath(res.path);
			uni.navigateTo({
				url: '/' + newPath
			})
		},
		fail: function (res) {
			console.log('扫码失败：', res);
		}
	});
	// #endif
	
	// #ifdef  H5
	let config = await getWechatConfig();
	jweixin.config({
		 debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
	      appId: config.appId, // 必填，公众号的唯一标识
	      timestamp: config.timestamp, // 必填，生成签名的时间戳
	      nonceStr: config.nonceStr, // 必填，生成签名的随机串
	      signature: config.signature, // 必填，签名
	      jsApiList: [
	        'scanQRCode'
	      ] ,
	 }
	);
	jweixin.ready(function() {
		jweixin.scanQRCode({
			 needResult: 1,
			 success: function(res) {
			  //alert(res.resultStr)
			  console.log('sanc:',res)
			  location.href = res.resultStr
			 }
		})
		
	})
	
	// #endif
}

const invite = () => {
	// uni.showToast({
	// 	title: '开发中......',
	// 	icon: 'error'
	// })
	uni.navigateTo({
		url: '/pages/components/pages/due/index'
	})
}

const login = () => {
	uni.navigateTo({
		url: '/pages/components/pages/login/login'
	})
}




onLoad(() => {
	console.log("开始")
 // main.init()
  handGetListAds()
  getNewsList()
})

</script>

<style lang="scss">
.size-sm {
	font-size: 20rpx;color: #282828;
}
.index-img {
	width: 120px;
	height: 120rpx;
	position: relative;
	left:-20rpx
}
.img-01 {
	width: 100px;
	height: 100rpx;
	margin-top: 30rpx;
}
.img-02 {
	width: 110px;
	height: 110rpx;
	margin-top: 20rpx;
}
	
	
/* #ifdef H5 */
page {
	height: auto;
	min-height: 100%;
}
/* #endif */
page {
	//background-color: #ffffff!important;
}
.banner {
	position: relative;
	width: 100%;
	//height: 300rpx;
	
	.bg {
		width: 100%;
		height: 330rpx;
	}
	
	.intro {
		position: absolute;
		top: calc(50rpx + var(--status-bar-height));
		left: 40rpx;
		color: #FFFFFF;
		display: flex;
		flex-direction: column;
		
		.greet {
			font-size: $font-size-lg;
			margin-bottom: 10rpx;
		}
		
		.note {
			font-size: $font-size-sm;
		}
	}
}

.content {
	padding: 0 20rpx;
}
.content-user {
	background-color: #ffffff;position: relative;top:-56rpx;
}
.content-user-text {
	font-size: 24rpx;color: #282828;
}
.content-user-login {
	color:#ffffff;border-radius: 40rpx;font-size: 22rpx;border: solid;background-color: #09b4f1;
}


.info {
	position: relative;
	margin-bottom: 10rpx;
	border-radius: 10rpx;
	background-color: #ffffff;
	box-shadow: $box-shadow;
	padding: 30rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	
	.integral_section {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		
		.top {
			display: flex;
			align-items: center;
			
			.title {
				color: $text-color-base;
				font-size: $font-size-base;
				margin-right: 10rpx;
			}
			.value {
				font-size: 44rpx;
				font-weight: bold;
			}
		}
		
		.bottom {
			font-size: $font-size-sm;
			color: $text-color-assist;
			display: flex;
			align-items: center;
		}
	}
	
	.qrcode_section {
		color: $text-color-black;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: $font-size-sm;
		
		image {
			width: 70rpx;
			height: 70rpx;
			// margin-bottom: 10rpx;
		}
	}
}




.yshop-menu {
	margin-bottom: 10rpx;
	position: relative;
	margin-top: -42rpx;
}
.yshop-menu-item {
	background-color: #ffffff;
	width: 350rpx;
	padding-bottom: 30rpx;
}


.member-news {
	width: 100%;
	margin-bottom: 30rpx;
	background-color: #ffffff;
	padding: 0 20rpx 30rpx 30rpx;
	.header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 0;
		
		.title {
			font-size: $font-size-lg;
			font-weight: bold;
		}
		
		.iconfont {
			font-size: 52rpx;
			color: $text-color-assist;
		}
	}
	
	.list {
		width: 100%;
		display: flex;
		flex-direction: column;
		
		.item {
			width: 100%;
			height: 240rpx;
			position: relative;
			margin-bottom: 10rpx;
			
			image {
				width: 100%;
				height: 100%;
				border-radius: 8rpx;
			}
			
			.title {
				position: relative;
				font-size: 32rpx;
				font-weight: 500;
				width: 100%;
				top: -70rpx;
				left: 16rpx;
				color: #ffffff;
			}
		}
	}
}

</style>
